<template>
	<div class="container">
		<div class="chj_wenti_template">
			<div class="chj_wenti">
				<div class="chj_w_com chj_wt_shadow">
					当前位置 ：
					<a class="chj_w_com_a" href='https://www.qiyebang.net.cn/'> 网站首页 > </a>
					<a class="chj_w_com_a" href="/questionDetails/1"> 疑问解答 > </a>
					<span> 全部问题 </span>
				</div>
				<div class="chj_w_content">
					<ul class="chj_w_nav chj_wt_shadow af">
						<li class="chj_w_nav_li" v-for="(item,index) in nav" :key='item' v-bind:class="[index==chj_wnav_tap ? 'chj_w_nav_li chj_nav_tap':'chj_w_nav_li']" @click="tap(index)">
							<a v-bind:class="[index==chj_wnav_tap ? 'chj_nav_tap_a':'chj_w_com_a']" href="javascript:;">{{item}}</a><i class="chj_wenti_icon"></i></li>
					</ul>
					<div class="chj_w_tap af">
						<ul class="chj_wtap_left">
							<li v-for="(chj_wtype,index) in chj_wtype" :key='index' @click="cstate(chj_wtype.id)" v-bind:class="[chj_wtype.id==chj_w_tap ? 'chj_wleft_a1 chj_wleft_border':'chj_wleft_a2']">
								<a v-bind:class="[chj_wtype.id==chj_w_tap ? 'chj_wleft_a1':'chj_wleft_a2']" href="javascript:;">{{chj_wtype.name}}</a>
							</li>
						</ul>
						<div class="chj_wtap_right chj_wtap_right2">
							<input type="text" placeholder="按关键词检索" v-model="csou" />
							<a @click="all_tap()" href="javascript:;">搜索</a>
						</div>
					</div>

					<div v-if="chj_w_tap==1">
						<ul style="background: white; padding: 0 20px; min-height: 710px;">
							<li class="chj_le_list chj_module_list chj_wenti_list chj_wbortop chj_wpadd" v-for="(i,index) in ywarr[chj_wnav_tap][0]" :key="index">
								<p class="chj_le_list_left chj_wlist_left" @click="cgo(i.id)">
									<span><a href="javascript:;" class="chj_list_a" >{{i.content}}</a></span>
									<span class="chj_span ">[ {{i.cate_title}} ] </span>
								</p>
								<p class="chj_le_list_right chj_wlist_right chj_wtrig">
									<span>回答数 ：{{i.answer_number}}</span>
									<span style="margin-left: 15px; margin-right: 20px; "><i class="icon" style="left: 80px;"></i></span>
									<span>{{i.updatetime}}</span>
								</p>
							</li>
						</ul>
					</div>

					<div v-if="chj_w_tap==0">
						<div style="background: white; padding: 0 20px; min-height: 710px;">
							<div class="chj_le_list chj_module_list chj_daiisste" :class="'aa'+index" v-for="(i,index) in ywarr[chj_wnav_tap][1]" :key="index">
								<div class="kai " @click="kai(index)">
									<div v-bind:class="[chj_kai==index ? 'chj_wbortop af chj_daiisste_title1 chj_daiisste_list': 'chj_wbortop af chj_daiisste_title1'] ">
										<p class="chj_le_list_left chj_wlist_left chj_daiisste_left ">
											<span><a href="javascript:; " class="chj_list_a " >{{i.content}}</a></span>
											<span class="chj_span " ref='chj_span'>{{chj_kai==index?'': i.cate_title }}</span>
										</p>
										<p class="chj_le_list_right chj_wlist_right chj_wtrig chj_daiisste_right ">
											<span>回答数 ： {{i.answer_number}}</span>
											<span style="margin-left: 15px; margin-right: 20px; "><i class="icon" style="left: 80px;"></i></span>
											<span>{{i.updatetime}}</span>

										</p>
									</div>
								</div>
								<div class="chj_daiisste_list " v-show="chj_kai==index ">
									<div class="chj_daiisste_content ">
										<p>
											<span>编号：<i>123456789</i></span>
											<span style="padding: 0 36px; ">类别：<i>[ {{i.cate_title}} ]</i> </span>
											<span>浏览：<i>45</i>次</span>
										</p>
										<div class="chj_daiisste_biaodan ">
											<form action=" " method="get ">
												<textarea class="chj_daiisste_textarea" v-model="chj_daiisste_text" :class="'tx'+index" placeholder="我来帮TA回答问题"></textarea>
												<div class="chj_dai_up_biaodan af ">
													<span class="chj_daiissue_up " @click="guan(index) ">收起</span>
													<input @click="ccsubmits(i.id,'tx'+index)" type="submit " value="提交回答 " />
												</div>
											</form>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div style="display: flex; align-items: center; justify-content: center;padding-top: 50px;padding-bottom: 50px;background: white;">
						<el-button @click='shouye' class='shou'>首页</el-button>
						<el-pagination id='pabtn' background layout="prev, pager, next" size-change @current-change='cpage' prev-text='上一页' next-text='下一页' :current-page='this.cpages' prev-click='1' :page-count='cpages' :total="total">
						</el-pagination>
						<el-button @click='weiye' class='wei'>尾页</el-button>
					</div>
				</div>

			</div>
		</div>
		<my-ft></my-ft>
	</div>

</template>

<script>
	import axios from 'axios';
	import $ from 'jquery';
	export default {
		name: 'HelloWorld',
		data() {
			return {
				chj_pages_tap: 0,
				chj_wtype: [{
						id: 1,
						name: '已解决'
					},
					{
						id: 0,
						name: '待解决'
					},
				],
				//0 待解决
				//1 已解决
				nav: ['工商服务', '财税记账', '商标知产', '资质商城', '社保人事'],
				chj_wnav_tap: 0,
				chj_w_tap: 1,
				chj_daiisste_text: '',
				chj_kai: 0,
				chj_guan: 0,
				chj_type: true,
				all: '',
				csou: '',
				cctap: 1,
				chj: '',
				cpages: 1,
				total: 0,
				uid: '',
				ywarr: [
					[[],[]],
					[[],[]],
					[[],[]],
					[[],[]],
					[[],[]],
				],
			}
		},
		async asyncData({
			params
		}) {
			let nh = await axios.get(`https://exam.zhonghaiqihang.com/PInterface/Header/headerData`);
			let all = await axios.get(`https://exam.zhonghaiqihang.com/PInterface/Problem`);
			let vv = await axios.get(`https://exam.zhonghaiqihang.com/PInterface/Problem/detail`);
			let data = {
				nav: nh.data,
				all: all.data,
				vv: vv.data,
			};
			return {
				title: data
			}
		},
		mounted: function() {
			var _this = this
			_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 1,
						is_solve: 1,
					}
				})
				.then(function(response) {
					_this.ywarr[0][0] = response.data.data

					//					 = response.data
				});

			_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 1,
						is_solve: 0,
					}
				})
				.then(function(response) {
					_this.ywarr[0][1] = response.data.data
				});
				_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 2,
						is_solve: 1,
					}
				})
				.then(function(response) {
					_this.ywarr[1][0]= response.data.data

					//					 = response.data
				});

			_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 2,
						is_solve: 0,
					}
				})
				.then(function(response) {
					_this.ywarr[1][1] = response.data.data
				});
				
					_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 3,
						is_solve: 1,
					}
				})
				.then(function(response) {
					_this.ywarr[2][0]= response.data.data

					//					 = response.data
				});

			_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 3,
						is_solve: 0,
					}
				})
				.then(function(response) {
					_this.ywarr[2][1] = response.data.data
				});
						_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 4,
						is_solve: 1,
					}
				})
				.then(function(response) {
					_this.ywarr[3][0]= response.data.data

					//					 = response.data
				});

			_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 4,
						is_solve: 0,
					}
				})
				.then(function(response) {
					_this.ywarr[3][1] = response.data.data
				});
				
				
						_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 5,
						is_solve: 1,
					}
				})
				.then(function(response) {
					_this.ywarr[4][0]= response.data.data

					//					 = response.data
				});

			_this.$axios.get('api/PInterface/Problem?', {
					params: {
						cate_id: this.chj_wnav_tap + 5,
						is_solve: 0,
					}
				})
				.then(function(response) {
					_this.ywarr[4][1] = response.data.data
				});
			console.log(_this.ywarr[0])
//			console.log(flatten(_this.ywarr))
			this.chj_w_tap = this.$route.query.is_solve
			console.log(this.$route.query.is_solve)
			if(!this.$route.query.is_solve) {
				this.chj_w_tap = 1
			}
			console.log(this.title)
			console.log(this.cpages)
			let a = document.cookie;
			let cookie = '';
			if(a.indexOf('userinfoRes') != -1) {
				let b = a.split('userinfoRes=');
				let c = b[1].split(';');
				cookie = c[0];
				this.chj = cookie
				console.log(this.chj)
			}
			console.log(this.title.all.data)
			this.all_tap()

		},
		head() {
			return {
				title: '企业邦问答',
				meta: [{
						hid: 'description',
						name: 'description',
						content: '企业邦问答'
					},
					{
						hid: 'keywords',
						name: 'keywords',
						content: '企业邦问答'
					}
				]
			}
		},
		methods: {

//			flatten(arr){
//			    while(arr.some(item=>Array.isArray(item))){
//			        arr = [].concat(...arr);
//			    }
//			    return arr;
//			},	
			tap(i) {
				var _this = this
				this.chj_wnav_tap = i;
				console.log(i)
			
			},
			cgo(i) {
				var _this = this
				_this.$axios.get('api/PInterface/Problem/detail?', {
						params: {
							problem_id: i
						}
					})
					.then(function(response) {
						console.log(response)
					});
				console.log(i)
				this.$router.push({
					path: '/questionDetails/' + i
				})
			},

			shouye() {
				this.cpages = 1
				this.all_tap()
			},
			weiye() {
				this.cpages = Number(Math.ceil(this.total / 15))

				console.log(this.cpages)
				this.all_tap()
			},
			cstate(i) {
				this.chj_w_tap = i
				console.log(i)
				if(this.chj_w_tap == 0) {
					this.cpages = 1
					this.all_tap()
				}
				console.log(this.cpages)
				this.all_tap()

			},
			cpage(i) {
				this.cpages = i
				this.all_tap()
				console.log(i)
			},
			kai: function(i) {
				this.chj_kai = i
				$('.chj_daiisste_content').eq(i).show()

			},
			guan: function(i) {
				$('kai').eq(i).show()
				$('.chj_daiisste_content').eq(i).hide()
				$('.chj_span').eq(i).show()
				//				console.log(!)
				if(this.chj_type == false) {
					$('.chj_span').eq(i).html('')
					this.chj_type == true
				} else {
					$('.chj_span').eq(i).html('[  工商注册  ]')
					this.chj_type == false
				}
			},
			all_tap() {
				var _this = this
				_this.$axios.get('api/PInterface/Problem?', {
						params: {
							keyword: _this.csou ? _this.csou : '',
						}
					})
					.then(function(response) {
						_this.all = response.data.data
						_this.total = Number(response.data.total)
//						console.log(_this.total)
						console.log(_this.all)
					});

			},
			ccsubmits: function(uid, tx) {
				this.uid = uid
				//	    	console.log(wid)
				var v = $('.' + tx).val()
				console.log(v)
				var _this = this
				_this.$axios.post('api/PInterface/Answer/add', 'userid=' + this.chj + '&problem_id=' + uid + '&content=' + v)
					.then(function(response) {
						console.log(response)
						if(_this.chj == '') {
							alert('请先登录')
						} else if(v == '') {
							alert('请输入内容')
						} else {
							if(response.data.code == 200) {
								alert('恭喜您获得' + response.data.score + '积分')
								console.log(response.data)
								$('.aa0').style.display = 'none';
							}

						}
					});
			},
		}
	}
</script>

<style scoped>

</style>